<#import "/macro.ftl" as m>
<@m.page_header title='后台' />
<div id="page-content-wrapper">

<div id="page-title">
    <h3>
        保有量分析
    </h3>
</div>

<div class="example-box">
    <div class="example-code">

        <a href="/stat/inventory" class="btn large primary-bg" title="">
            <span class="button-content">保有量现状</span>
        </a>
        &nbsp;&nbsp;
        <a href="/stat/structure" class="btn large primary-bg" title="">
            <span class="button-content">保有量组成</span>
        </a>
        &nbsp;&nbsp;
        <a href="/stat/trend" class="btn large primary-bg" title="">
            <span class="button-content">保有量趋势</span>
        </a>
    </div>
   </div>
<div class="pad10A">

<div style="col-md-12">
	<hr>
	<div class="form-row">
    	<div class="form-label col-md-4">
	    	<label for="">
                <font size="4">当前保有量：</font>
            </label>
	    	<label for="">
                <font size="3" color="blue">当前保有量 ${inventory}元</font>
            </label>
    	</div>
		<div class="col-md-6" id="container" ></div>
    </div>
    <br><br>
    <hr>
	<div class="form-row">
    	<div class="form-label col-md-3">
	    	<label for="">
                <font size="4">分类产品保有量：</font>
            </label>
	    	<#list inventoryList2 as source2>
	    	<label for="">
            	<font size="3" color="blue">${source2}元</font>
            </label>
            </#list>
    	</div>
        <div class="col-md-8" id="container2" ></div>
    </div>
    <br><br>
    <hr>
	<div class="form-row">
    	<div class="form-label col-md-3">
	    	<label for="">
                <font size="4">区域保有量分析：</font>
            </label>
            <#list dataMap?keys as dataMapKey>
	    	<label for="">
            	<font size="3" color="blue">${dataMapKey} ${dataMap[dataMapKey]}元</font>
            </label>
            </#list>
    	</div>
        <div class="col-md-8" id="container3" ></div>
    </div>
    <br><br>
    <hr>
	<div class="form-row">
    	<div class="form-label col-md-3">
	    	<label for="">
                <font size="4">浙江省内保有量分析：</font>
            </label>
            <#list dataMap2?keys as dataMapKey2>
	    	<label for="">
            	<font size="3" color="blue">${dataMapKey2} ${dataMap2[dataMapKey2]}元</font>
            </label>
            </#list>
    	</div>
        <div class="col-md-8" id="container4" ></div>
    </div>
</div>

</div>

<script type="text/javascript" src="/assets/js/minified/demo/exporting.js"></script>
<script type="text/javascript" src="/assets/js/minified/demo/highcharts.js"></script>
<script type="text/javascript">

$(function () {

    $('#container').highcharts({
        chart: {
            type: 'column'
        },
        title: {
            text: '当前保有量'
        },
        xAxis: {
            categories: [
                '当前保有量'
            ]
        },
        yAxis: {
            min: 0,
            title: {
                text: '元'
            }
        },
        tooltip: {
            headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
            pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
                '<td style="padding:0"><b>{point.y:.1f} 元</b></td></tr>',
            footerFormat: '</table>',
            shared: true,
            useHTML: true
        },
        plotOptions: {
            column: {
                pointPadding: 0.2,
                borderWidth: 0
            }
        },
        series: [{
            name: '收入',
            data: [${income}]

        }, {
            name: '支出',
            data: [${expenses}]

        }]
    });
    
    
    $('#container2').highcharts({
        chart: {
            type: 'column'
        },
        title: {
            text: '分类产品保有量分析'
        },
        xAxis: {
            categories: [
            <#list typenameList as typename>
            '${typename}',
            </#list>
            ],
            labels: {
                rotation: -45,
                align: 'right'
            }
        },
        yAxis: {
            min: 0,
            title: {
                text: '元'
            }
        },
        tooltip: {
            headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
            pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
                '<td style="padding:0"><b>{point.y:.2f} 元</b></td></tr>',
            footerFormat: '</table>',
            shared: true,
            useHTML: true
        },
        plotOptions: {
            column: {
                pointPadding: 0.2,
                borderWidth: 0
            }
        },
        series: [{
            name: '收入',
            data: [<#list incomeAmountList2 as incomeAmount2>${incomeAmount2},</#list>]

        }, {
            name: '支出',
            data: [<#list expensesAmountList2 as expensesAmount2>${expensesAmount2},</#list>]

        }]
    });
    
    
     $('#container3').highcharts({
        chart: {
            plotBackgroundColor: null,
            plotBorderWidth: null,
            plotShadow: false
        },
        title: {
            text: '区域保有量分析'
        },
        tooltip: {
    	    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
        },
        plotOptions: {
            pie: {
                allowPointSelect: true,
                cursor: 'pointer',
                dataLabels: {
                    enabled: true,
                    color: '#000000',
                    connectorColor: '#000000',
                    format: '<b>{point.name}</b>:{point.y}- {point.percentage:.1f} %'
                }
            }
        },
        series: [{
            type: 'pie',
            name: '保有量',
            data: [
            	<#list result?keys as resultKey>
            		['${resultKey}',  ${result[resultKey]}],
            	</#list>
            ]
        }]
    });
    
    
     $('#container4').highcharts({
        chart: {
            plotBackgroundColor: null,
            plotBorderWidth: null,
            plotShadow: false
        },
        title: {
            text: '浙江省内保有量分析'
        },
        tooltip: {
    	    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
        },
        plotOptions: {
            pie: {
                allowPointSelect: true,
                cursor: 'pointer',
                dataLabels: {
                    enabled: true,
                    color: '#000000',
                    connectorColor: '#000000',
                    format: '<b>{point.name}</b>:{point.y}- {point.percentage:.1f} %'
                }
            }
        },
        series: [{
            type: 'pie',
            name: '保有量',
            data: [
            	<#list result2?keys as resultKey2>
            		['${resultKey2}',  ${result2[resultKey2]}],
            	</#list>
            ]
        }]
    });
    
    
});				
				

</script>
